import 'package:flutter/material.dart';

class SearchBar extends StatefulWidget implements PreferredSizeWidget {
  final double height;
  final bool enabled;
  final bool hideLeft;
  final String hint;
  final String defaultText;
  final void Function() leftButtonClick;
  final void Function() rightButtonClick;
  final void Function() speakClick;
  final void Function() inputBoxClick;
  final ValueChanged<String> onChanged;

  const SearchBar(
      {Key key,
      this.height = 56,
      this.enabled = true,
      this.hideLeft,
      this.hint,
      this.defaultText,
      this.leftButtonClick,
      this.rightButtonClick,
      this.speakClick,
      this.inputBoxClick,
      this.onChanged})
      : super(key: key);

  @override
  _SearchBarState createState() => _SearchBarState();

  @override
  Size get preferredSize => Size.fromHeight(height); //这里设置控件（appBar）的高度
}

class _SearchBarState extends State<SearchBar> {
  bool showClear = false;
  final TextEditingController _controller = TextEditingController();

  @override
  void initState() {
    if (widget.defaultText != null) {
      setState(() {
        _controller.text = widget.defaultText;
      });
    }
    super.initState();
  }

  @override
  Widget build(BuildContext context) {
    return _genNormalSearch();
  }

  _genNormalSearch() {
    return Container(
      height: 56,
      margin: EdgeInsets.only(top: 35),
      child: Row(children: <Widget>[
        _wrapTap(
            Container(
              padding: EdgeInsets.fromLTRB(20, 5, 10, 5),
              child: widget?.hideLeft ?? false
                  ? null
                  : Icon(
                      Icons.arrow_back_ios,
                      color: Colors.blue,
                      size: 26,
                    ),
            ),
            widget.leftButtonClick),
        Expanded(
          flex: 1,
          child: _inputBox(),
        ),
        _wrapTap(
            Container(
              padding: EdgeInsets.fromLTRB(10, 7, 10, 7),
//              child: Text(
//                '搜索',
//                style: TextStyle(color: Colors.blue, fontSize: 17),
//              ),
            ),
            widget.rightButtonClick)
      ]),
    );
  }

  _inputBox() {
    Color inputBoxColor;
    inputBoxColor = Color(int.parse('0xffEDEDED'));

    return Container(
      height: 40,
      padding: EdgeInsets.fromLTRB(10, 3, 10, 3),
      decoration: BoxDecoration(
          color: inputBoxColor, borderRadius: BorderRadius.circular(5)),
      child: Row(
        children: <Widget>[
          Icon(
            Icons.search,
            size: 20,
            color: Color(0xffA9A9A9),
          ),
          Expanded(
              flex: 1,
              child: TextField(
                  controller: _controller,
                  onChanged: _onChanged,
                  autofocus: false,
                  enabled: widget.enabled,
                  style: TextStyle(
                      fontSize: 14.0,
                      color: Colors.black,
                      fontWeight: FontWeight.w300),
                  //输入文本的样式
                  decoration: InputDecoration(
                    contentPadding: EdgeInsets.fromLTRB(8, -15, 0, 0),
                    border: InputBorder.none,
                    hintText: widget.hint ?? '',
                    hintStyle: TextStyle(fontSize: 15),
                  ))),
          !showClear
              ? Container()
              : _wrapTap(
                  Icon(
                    Icons.clear,
                    size: 22,
                    color: Colors.grey,
                  ), () {
                  setState(() {
                    _controller.clear();
                  });
                  _onChanged('');
                })
        ],
      ),
    );
  }

  _wrapTap(Widget child, void Function() callback) {
    return GestureDetector(
      onTap: () {
        if (callback != null) callback();
      },
      child: child,
    );
  }

  _onChanged(String text) {
    if (text.length > 0) {
      setState(() {
        showClear = true;
      });
    } else {
      setState(() {
        showClear = false;
      });
    }
    if (widget.onChanged != null) {
      widget.onChanged(text);
    }
  }
}
